<template>
	<view>
		<basetab :name="type==1 ? '佣金提现' : '钱包提现'" />
		<view class="pageView">
			<view class="box card">
				<view class="title">
					{{type == 1 ? '佣金提现' : '钱包提现'}}
				</view>
				<view class="subTitle">
					提现金额
				</view>
				<view
					style="margin: 25rpx auto;width: 580rpx;border-bottom: 1rpx solid rgba(216, 216, 216, 1);padding-bottom: 36rpx;">
					<u--input fontSize="55rpx" color="rgba(35, 35, 35, 1)" placeholder="请输入金额" v-model="num"
						type="number" placeholderClass="placeholder" border="none" prefixIcon="rmb"
						:prefixIconStyle="prefixIconStyle">

					</u--input>
				</view>
				<view style="margin-top: 133rpx;">
					<button class="submitBtn" @click="actionShow=true">提现</button>
				</view>
				<view :class="{warning:warning}"
					style="text-align: center;margin-top: 22rpx;color: rgba(212, 48, 48, 1);font-size: 24rpx;font-weight: 700;">
					{{notice}}
				</view>
			</view>
		</view>
		<u-popup :show="actionShow">
			<view class="payView">
				<view class="pay">
					<view style="display: flex;">
						<image src="../../static/my/wxlogo.png" class="wxlogo"></image>
						<text style="font-size: 34rpx;color: #000;margin-left: 20rpx;">微信支付</text>
					</view>
					<label class="radio">
						<radio value="" color="#ff8800" :checked="checked" style="transform:scale(0.8)"
							@click="checked = !checked" />
					</label>
				</view>
				<view class="cancel" @click="submit">
					<view class="">
						确定
					</view>
				</view>
			</view>
		</u-popup>
	</view>

</template>

<script>
	import basetab from '@/componets/bartop.vue'
	export default {
		components: {
			basetab
		},
		onLoad(option) {
			console.log("option: ", option);
			this.type = Number(option.type)
			if (type == 1) {
				this.notice = '提示：每次提现金额不得小于100'
			}
		},
		data() {
			return {
				notice: '提示：每次提现不得低于100，且收取提现金额为1%',
				warning: false,
				type: 0,
				checked: false,
				actionShow: false,
				num: '0',
				prefixIconStyle: {
					fontSize: '65prx',
					color: 'rgba(35, 35, 35, 1)',
					fontWeight: 700,
				}
			};
		},
		methods: {
			submit() {
				//'佣金不足！' 钱包不足！
				if (Number(this.num) < 100) {
					this.warning = true
					setTimeout(() => {
						this.warning = false
					}, 700)
					return
				}
				if (this.checked) {
					uni.showToast({
						icon: 'success',
						title: this.type == 1 ? '申请成功！' : '提现成功！'
					})
				} else {
					uni.showToast({
						icon: 'error',
						title: '取消提现'
					})
				}
				this.actionShow = false
			}
		}

	}
</script>

<style lang="scss">
	.payView {
		background-color: rgba(249, 249, 249, 1);
		height: 244rpx;
		width: 750rpx;

		.wxlogo {
			width: 40rpx;
			height: 40rpx;
		}

		.pay {
			height: 112rpx;
			background-color: #fff;
			width: 100%;
			padding: 0 52rpx;
			box-sizing: border-box;
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.cancel {
			height: 180rpx;
			margin-top: 15rpx;
			background-color: #fff;
			width: 100%;
			text-align: center;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}

	.box {
		width: 690rpx;
		height: 620rpx;
		margin-top: 16rpx;
		box-sizing: border-box;
		padding: 38rpx 20rpx;
		color: rgba(35, 35, 35, 1);

		.title {
			font-weight: 700;
			font-size: 32rpx;
		}

		.subTitle {
			font-size: 28rpx;
			margin: 37rpx 0 0 42rpx;
		}
	}

	.placeholder {
		font-size: 45rpx;
	}
</style>